import axios from '../../request/axios'
import React, { useEffect, useState } from 'react'
import { Flex, Tag,Badge } from 'antd';
function Home() {
    const [data,setdata] = useState()
    useEffect(() => {
        axios({
            url:'http://blogapi.shbwyz.com/category/list',
            method:'get'
        }).then(res => {
            console.log(res)
            setdata(res.data)
        })
    },[])
  return (
    <div>
        <div style={{display:'flex',flexWrap:'wrap'}}>
            {data && data.map<React.ReactNode>((tag) => (
        <div style={{margin:'20px',}}>
            <Badge count={tag.count}>
        <Tag
          key={tag.id}
          color={'#f0' + tag.count}
        >
          {tag.name}
        </Tag>
        </Badge>
        </div>
      ))}
        </div>
      
    </div>
  )
}

export default Home
